<template>
  <div v-if="bdInfo?.state == '2'">
    <div class="flex items-center justify-between mt-[30px] text-[16px]">
      <div class="flex items-center">
        <div class="w-[4px] h-[12px] bg-[#EF6800]"></div>
        <div class="ml-[10px] text-[#EF6800] text-[16px] font-bold">保单信息</div>
      </div>
    </div>
    <div class="flex mt-[20px]">
      <el-form-item label="保单号" class="flex-1" style="font-size: 18px">
        <div class="w-[318px]">{{ bdInfo?.bd_no }}</div>
      </el-form-item>
      <el-form-item :label="fpText" class="flex-1">
        <div
          v-if="bdInfo?.bd_url"
          class="px-[10px] mr-[20px] h-[35px] flex justify-center items-center text-white rounded-[4px] bg-[#EF6800] cursor-pointer font-bold text-[18px]"
        >
          <a :href="bdInfo?.bd_url" target="_blank" download="电子保单">下载电子保单</a>
        </div>
        <div
          @click="handleBd"
          v-if="bdInfo?.bd_url && (bdInfo?.bx_id == 7 || bdInfo?.bx_id == 8)"
          class="px-[10px] mr-[20px] h-[35px] flex justify-center items-center text-white rounded-[4px] bg-[#EF6800] cursor-pointer font-bold text-[18px]"
        >
          重新获取
        </div>
        <div
          v-if="!bdInfo?.bd_url"
          @click="handleBd"
          class="px-[10px] mr-[20px] h-[35px] flex justify-center items-center text-white rounded-[4px] bg-[#EF6800] cursor-pointer font-bold text-[18px]"
        >
          获取电子保单
        </div>
        <div class="flex items-center" v-if="!bdInfo.is_apply && !invoice_type">
          <div
            v-if="!bdInfo.fp_url"
            @click="openFp(2)"
            class="px-[10px] mr-[20px] h-[35px] flex justify-center items-center text-white rounded-[4px] bg-[#EF6800] cursor-pointer font-bold text-[18px]"
          >
            获取电子发票
          </div>
          <div
            v-if="!bdInfo.fp_url"
            @click="openFp(1)"
            class="px-[10px] mr-[20px] h-[35px] flex justify-center items-center text-white rounded-[4px] bg-[#EF6800] cursor-pointer font-bold text-[18px]"
          >
            申请专票
          </div>
          <div
            v-if="bdInfo.fp_url"
            @click="downloadFp"
            class="px-[10px] mr-[20px] h-[35px] flex justify-center items-center text-white rounded-[4px] bg-[#EF6800] cursor-pointer font-bold text-[18px]"
          >
            下载电子发票
          </div>
        </div>
      </el-form-item>
    </div>
    <!-- <div>
      <div>保单号</div>
      <div>{{ bdInfo?.bd_no }}</div>
    </div>
    <div>
      <div>电子保单</div>
      <div>{{ bdInfo?.bd_no }}</div>
    </div> -->
  </div>
</template>
<script setup lang="ts">
import { defineProps, defineEmits, inject, computed } from "vue";
import { getBd } from "@/utils/api";
import { useRoute } from "vue-router";
const props = defineProps({
  bdInfo: { type: Object },
  invoice_type: { type: Number, default: 0 },
});

const message = inject("message") as any;
const route = useRoute();
const emit = defineEmits(["getData", "downloadFp", "openFp"]);
const handleBd = async () => {
  const res = await getBd({ id: route.query.order_id });
  if (res.code == 1) {
    emit("getData");
    message.success(res.msg);
  } else {
    message.warning(res.msg);
  }
  // console.log(res);
};
const fpText = computed(() => {
  if (props.invoice_type) {
    return "电子保单";
  }
  return "电子保单/发票";
});
const downloadFp = () => {
  emit("downloadFp");
};
const openFp = (index: number) => {
  emit("openFp", index);
};
//重新获取
const clickCx = () => {};
</script>
<style scoped lang="scss"></style>
